<template>
  <div>
    <h1>商品子级分类</h1>
    <el-table :data="list" style="width: 100%" border>
      <el-table-column prop="id" label="品类id"> </el-table-column>
      <el-table-column prop="name" label="品类名称"> </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-tag calss="el-inco-edit" @click="open(scope.row)"
            >修改名称</el-tag
          >
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>
<script>
import { goods_cates,cate_edit } from "@/api/api";
export default {
  name: "",
  components: {},
  props: [],
  data() {
    return {
      list: [],
    };
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {
    this.getlist();
  },
  methods: {
    async getlist() {
      const { data: res } = await goods_cates(this.$route.params.id);
    //   console.log(res);
      this.list = res.data;
    },
     open(data) {
      this.$prompt("请输入修改名称", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        inputPlaceholder:data.name,
      })
        .then(({ value }) => {
            console.log(value)
            cate_edit(`/api/category/set_category_name.do?categoryId=${data.id}&categoryName=${value}`).then(res=>{
                console.log(res)
                this.$message.success(res.data.data)
                this.getlist();
            }).catch(err=>{
                console.log(err)
            })
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "取消输入",
          });
        });
    },
  },
};
</script>
<style scoped>
</style>